@import 'public';

// banner图部分


#banner {
	width: 1900px;
	height: 570px;
	margin: 0 auto;

	iframe {
		width: 1900px;
		height: 570px;
	}

	// 	.img_box {
	// 		width: 3840px;
	// 		display: flex;
	// 		flex-wrap: nowrap;
	// 		position: absolute;

	// 		a {

	// 			display: block;
	// 		}

	// 		img {
	// 			width: 1920px;

	// 		}
}



// 	/* 图片轮播条  */
// 	.wrap .trgBox {
// 		position: absolute;
// 		right: 8%;
// 		top: 530px;

// 		span {
// 			line-height: 5px;
// 			font-weight: bold;
// 			width: 20px;
// 			height: 6px;
// 			background: #000;
// 			filter: alpha(opacity=70);
// 			opacity: 0.7;
// 			cursor: pointer;
// 			float: left;
// 			margin-left: 6px;
// 		}
// 		.show {
// 			background:red;
// 			width: 31px;
// 			// 	background: #fff;
// 			// 	filter: alpha(opacity=40);
// 			// 	opacity: .4;
// 		}
// 		// .hover {
// 		// 	width: 31px;
// 		// 	background: #fff;
// 		// 	filter: alpha(opacity=40);
// 		// 	opacity: .4;
// 		// }
// 	}
// }

/* 新品推荐部分  */
#new_products {
	width: 100%;

	/* 新品推荐部分标题 */
	.command-title {
		width: 100%;
		margin: 66px 0 30px 0;

		.title {
			font-size: 42px;
			font-weight: 600;
			color: #333;
			text-align: center;
		}

		.tabs {
			margin: 25px auto 40px;
			text-align: center;

			a {
				color: #333;
				padding: 0 10px;
				font-size: 16px;

				.active {
					text-decoration: underline;
				}
			}
		}
	}

	/* 新品推荐商品部分 */
	.new_products_shop {
		width: 990px;
		height: 451px;
		margin: 0 auto;
		position: relative;
		// background-color: aliceblue;

		// 显示商品部分
		.news_wrap {
			width: 990px;
			height: 450px;
			overflow: hidden;
			position: relative;

			.shop_wrap {
				width: 500%;
				position: absolute;

				li {
					width: calc(970px / 4);
					display: inline-block;
					box-sizing: border-box;
					padding: 10px;
					font-size: 12px;
					color: #333;
					text-align: center;

					a {
						img {
							width: 210px;
						}
					}

					.pirce_news {
						font-size: 18px;

					}
				}

				li:hover {
					background-color: #ccc;
				}

				.img_basto {
					width: 54px;
					height: 24px;
					margin: 20px auto;
				}

				.title {
					margin: 20px auto;
				}

				.pirce_news {
					font-size: 16px;
				}
			}

			.shop_left_button {
				font-size: 40px;
				color: gray;
				position: absolute;
				top: 50%;
				left: 0;
				margin-top: -50px;
				cursor: pointer;


			}

			span:hover {
				transform: scale(1.5);
			}

			.shop_right_button {
				font-size: 40px;
				color: gray;
				position: absolute;
				top: 50%;
				right: 0px;
				margin-top: -50px;
				cursor: pointer;
			}
		}

		//隐藏的商品
		.news_wrap1 {
			width: 990px;
			height: 450px;
			position: relative;
			overflow: hidden;
			display: none;

			.shop_wrap {
				width: 500%;
				overflow: hidden;
				position: absolute;

				li {
					width: calc(990px / 4);
					display: inline-block;
					box-sizing: border-box;
					padding: 10px;
					font-size: 12px;
					color: #333;
					text-align: center;

					a {
						img {
							width: 210px;
						}
					}

					.pirce_news {
						font-size: 18px;

					}
				}

				li:hover {
					background-color: #ccc;
				}

				.img_basto {
					width: 54px;
					height: 24px;
					margin: 20px auto;
				}

				.title {
					margin: 20px auto;
				}

				.pirce_news {
					font-size: 16px;
				}
			}

			.shop_le_button {
				font-size: 40px;
				color: gray;
				position: absolute;
				top: 50%;
				left: 0;
				margin-top: -50px;
				cursor: pointer;


			}

			span:hover {
				transform: scale(1.5);
			}

			.shop_rig_button {
				font-size: 40px;
				color: gray;
				position: absolute;
				top: 50%;
				right: 0px;
				margin-top: -50px;
				cursor: pointer;
			}
		}

		// 轮播按钮


		// 右按钮
	}
}

/* 今天主推大牌部分*/
#today_main {
	width: 990px;
	margin: 0 auto;

	/* 今天主推大牌标题 */
	.main-title {
		width: 990px;
		// margin: 0 auto;
		margin: 66px 0 30px 0;

		.title {
			font-size: 42px;
			font-weight: 600;
			color: #333;
			text-align: center;
		}

		.tabs {
			margin: 25px auto 40px;
			text-align: center;

			a {
				color: #333;
				padding: 0 10px;
				font-size: 16px;


			}

			:hover {
				text-decoration: underline;
			}
		}
	}

	//商品部分
	.main_shop {
		width: 100%;
		position: relative;


		/* 显示商品主图 */
		.main_img {
			width: 990px;
			height: 452px;
			margin: 0 auto;
			position: relative;
			// border: 1px solid red;

			.item1 {
				float: left;
				position: relative;
				left: 0;

				span {
					width: 315px;
					height: 402px;
					display: inline-block;
					background-color: black;
					background-image: url(../img/blackS-millies.png);
					background-repeat: no-repeat;
					background-position: center;
					opacity: 0;
					position: absolute;
					top: 0;
					left: 0;

				}

				:hover {
					opacity: 0.5;
				}
			}

			.item {
				margin: 0 20px;
				float: left;
				position: relative;

				span {
					width: 315px;
					height: 402px;
					display: inline-block;
					background-color: black;
					background-image: url(../img/whiteL-senda.png);
					background-repeat: no-repeat;
					background-position: center;
					opacity: 0;
					position: absolute;
					top: 0;
					left: 0;

				}

				:hover {
					opacity: 0.5;
				}
			}

			.item2 {
				float: left;
				position: relative;

				span {
					width: 315px;
					height: 402px;
					display: inline-block;
					background-color: black;
					background-image: url(../img/whiteL-tata.png);
					background-repeat: no-repeat;
					background-position: center;
					opacity: 0;
					position: absolute;
					top: 0;
					left: 0;

				}

				:hover {
					opacity: 0.5;
				}
			}
		}

		//隐藏图片
		.main_img1 {
			width: 990px;
			height: 452px;
			margin: 0 auto;
			display: none;

			.item1 {
				float: left;
				position: relative;

				span {
					width: 315px;
					height: 402px;
					display: inline-block;
					background-color: black;
					background-image: url(../img/whiteL-converse.png);
					background-repeat: no-repeat;
					background-position: center;
					opacity: 0;
					position: absolute;
					top: 0;
					left: 0;

				}

				:hover {
					opacity: 0.5;
				}
			}

			.item {
				margin: 0 20px;
				float: left;
				position: relative;

				span {
					width: 315px;
					height: 402px;
					display: inline-block;
					background-color: black;
					background-image: url(../img/whiteL-asics.png);
					background-repeat: no-repeat;
					background-position: center;
					opacity: 0;
					position: absolute;
					top: 0;
					left: 0;

				}

				:hover {
					opacity: 0.5;
				}
			}

			.item2 {
				float: left;
				position: relative;

				span {
					width: 315px;
					height: 402px;
					display: inline-block;
					background-color: black;
					background-image: url(../img/whiteL-reebok.png);
					background-repeat: no-repeat;
					background-position: center;
					opacity: 0;
					position: absolute;
					top: 0;
					left: 0;

				}

				:hover {
					opacity: 0.5;
				}
			}
		}

		/* 品牌图标 */
		.shop_logo_wrap {
			width: 990px;
			height: 50px;
			overflow: hidden;
			position: relative;
			margin: 0 auto;

			.main_shop_logo {
				width: 110%;
				height: 50px;
				display: flex;
				align-items: center;
				position: absolute;

				li {
					width: 10%;
					padding: 10px;
					box-sizing: border-box;
					float: left;
				}
			}

			img {
				width: 60px;
			}

			.prev {
				font-size: 32px;
				color: gray;
				position: absolute;
				top: 50%;
				left: 0px;
				margin-top: -25px;
			}

			span:hover {
				transform: skewY(10deg) scaleY(1.5);
				cursor: pointer;
			}

			.last {
				font-size: 32px;
				color: gray;
				position: absolute;
				top: 50%;
				right: 0px;
				margin-top: -25px;
			}

		}

	}

}

/* 品牌潮流资讯 */
#Brand_Trend_Information {
	width: 990px;
	height: 1563px;
	margin: 0 auto;
	clear: both;

	// 品牌标题
	.icon-title {
		width: 100%;
		margin: 66px 0 30px 0;

		.title {
			font-size: 42px;
			font-weight: 600;
			color: #333;
			text-align: center;
		}

		.en-title {
			margin: 25px auto 40px;
			font-size: 30px;
			color: gray;
			text-align: center;
		}
	}

	//品牌潮流主要部分
	.main_video {
		width: 990px;
		height: 470px;
		margin: 0 auto;
		position: relative;

		video {
			width: 320px;
			height: 470px;
			background-color: #000;
			position: absolute;

		}

		.center_video {
			// margin: 0 30px;
			position: absolute;
			top: 0;
			left: 335px;
		}

		.left_img {
			width: 320px;
			height: 470px;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 1;
		}

		.center_img {
			width: 320px;
			height: 470px;
			margin: 0 10px;
			position: absolute;
			top: 0;
			left: 325px;
			z-index: 1;
		}

		.right_img {
			width: 320px;
			height: 470px;
			position: absolute;
			top: 0;
			right: 0;
		}

	}

	.main_shoe {
		width: 990px;

		a {
			// width: calc(990px - 120px ) / 4;
			position: relative;

			img {
				width: 231px;
				margin: 50px 14px 110px 0;
				float: left;
			}

			.last_img {
				margin-right: 0;
			}

			span {
				width: 231px;
				height: 250px;
				line-height: 250px;
				text-align: center;
				position: absolute;
				top: 50px;
				left: 0px;
				opacity: 0;
				background-color: rgba(255, 255, 255, 0);

			}

			:hover {
				background-color: rgba(0, 0, 0, 0.5);
				opacity: 1;
				color: white;
			}
		}

	}

	.main_big_video {
		width: 990px;
		height: 500px;
		position: relative;

		img {
			width: 990px;
			height: 500px;
			// position: absolute;
			// top: 0;
			// left: 0;
			// z-index: 1;
		}

		video {
			width: 990px;
			height: 500px;
			position: absolute;
			top: 0;
			z-index: -1;
		}
	}

	// 品牌潮流资讯底部
	// .BTI_footer {
	// 	img {
	// 		width: 990px;
	// 	}
	// }
}

// 底部商品分类
#img8 {
	clear: both;
	width: 100%;
	height: 528px;

	.img8-cont {
		width: 990px;
		height: 528px;
		margin: 0 auto;
		background-image: url(../img/you_gou_pcfen_lei_ru_kou_.jpg);
		background-repeat: no-repeat;
		background-position: center 5px;

		a {
			display: inline-block;
			.box {
				float: left;
				width: calc(975px / 4);
				height: 220px;
				background-color: #fff;
				border: none;
				opacity: 0.1;
			}
			.box:hover{
				opacity: 0.5;
		}
		}
		
	}
}